<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<input id='input' type="text"> 
<button οnclick="send()">发送</button>
<div id='id'>
    
</div>
    <script>

function socketConnect(url) {
    const id = document.getElementById('id')
    // 客户端与服务器进行连接
    let ws = new WebSocket(url); // 返回`WebSocket`对象，赋值给变量ws
    // 连接成功回调
    ws.onopen = e => {
        console.log('连接成功', e)
        ws.send('我发送消息给服务端'); // 客户端与服务器端通信
    }
    // 监听服务器端返回的信息
    ws.onmessage = e => {
        console.log('服务器端返回：', e.data)
        // do something
        id.innerHTML = e.data

    }
    return ws; // 返回websocket对象
}
let wsValue = socketConnect('ws://192.168.0.146:6000'); 

function send(){
    const id = document.getElementById("input")
    wsValue.send(id.value)
}
</script>
</body>
</html>
